<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE HTML>
<html lang="zh-CN">
    <head>
    <meta charset="utf-8">
    <%@ include file="/WEB-INF/views/include/head.jsp"%> 
    <link rel="stylesheet" href="${ctxStatic}/css/layerSm.css">
        <script type="text/javascript">
            var windowH = window.innerHeight
                            ||document.documentElement.clientHeight
                            ||document.body.clientHeight
            $('.middle').css('height',windowH - 50);
            // 正则表达式，判断0到9字母a到z下划线_
            var lettersnumbers=/^[0-9a-zA-Z_\s?]*$/;

            $(document).ready(function(){
                // 下拉选框带搜索功能
                $("#styleCategoryCd").select2();

                // 当存在子项时添加class
                if($("#listLength").val()>0){
                    $("#contain").addClass('tabScroll');

                     var theadW = $('.tabScroll thead').width();
                        var theadTh = $('.tabScroll thead tr th').length;
                        $('.tabScroll thead tr th').width(theadW/theadTh);
                        $('.tabScroll tbody tr:first-child td').each(function(){
                            var indexNum = $(this).index()
                            var tdWidth = $('.tabScroll tbody tr:first-child td').eq(indexNum).css('width')
                            $('.tabScroll thead tr th').eq(indexNum).width(tdWidth);
                        });
                }
            });

            //保存方法
            var saveForm={
                s:null,
                t:null,
                save:function(s,t){
                    $(t).attr("disabled",true);
                    this.s=s;
                    this.t=t;
                        // 表单验证
                        $("#inputForm").validate({
                            submitHandler: function() {
                                // 从表单中获取数据
                                var params = $("#inputForm").serialize();
                                // 通过调用ajax调取后台方法
                                $.post("${ctx}/custom/fitproperty/save",params,function(result){
                                    // 提示信息
                                    tipParent(result.message);
                                    // 返回状态
                                    if(result.statusCode==STATUSCODEOK){
                                        if(saveForm.s==1){
                                            // 表单重置
                                            $("#inputForm")[0].reset();  
                                            // 下拉选框带搜索功能
                                            $("#styleCategoryCd").select2();
                                            $(saveForm.t).attr("disabled",false);
                                            // 刷新页面
                                            window.parent.frames[0].location.reload();
                                            addPropertyValue();
                                        }else{
                                            // 刷新页面
                                             window.parent.frames[0].location.reload();
                                            closeWin(); 
                                        }
                                    }else{
                                        $(saveForm.t).attr("disabled",false);
                                    }
                                },'json'); 
                            },

                            rules: {
                            // 后台验证重名方法
                            propertyCd: {remote: "${ctx}/custom/fitproperty/checkPropertyCd?oldPropertyCd=" +$("#oldPropertyCd").val() },
                            // 后台验证重名方法
                            propertyValue: {remote: "${ctx}/custom/fitproperty/checkPropertyValue?oldPropertyValue=" +$("#oldPropertyValue").val() },
                            
                            },
                            messages: {
                            //项目代码已存在
                            propertyCd: {remote: '<spring:message code="fitpropertyPropertyCd_exist"/>'},
                            //项目值已存在
                            propertyValue: {remote: '<spring:message code="fitpropertyPropertyValue_exist"/>'},
                            },
                            fail: function(element,e) {  
                                $(saveForm.t).attr("disabled",false);
                            }
                            
                        });
                        // 表单提交
                        $("#inputForm").submit(); 
                    }
                }
            //删除子项目
            function deleteSub(delIndex){
                //调取后台方法
                $.post("${ctx}/custom/fitproperty/deleteSub?delIndex=" + delIndex, "", function(result) {
                    // 回调页面值
                    var h = $(callBackHtml(result)).find("#subItem").html();
                    // 页面赋值
                    $('#subItem').html(h);

                    $("#contain").addClass('tabScroll');

                    var theadW = $('.tabScroll thead').width();
                    var theadTh = $('.tabScroll thead tr th').length;
                    $('.tabScroll thead tr th').width(theadW/theadTh);
                    $('.tabScroll tbody tr:first-child td').each(function(){
                        var indexNum = $(this).index()
                        var tdWidth = $('.tabScroll tbody tr:first-child td').eq(indexNum).css('width')
                        $('.tabScroll thead tr th').eq(indexNum).width(tdWidth);
                    });

                }, 'html');
            }
            // 新建子项
            function createSubItem(delIndex) {
                // 项目值不能为空
                if ($('#propertyCd').val() != null
                    && $('#propertyCd').val() != 'null'
                    && $('#propertyCd').val().trim() != ''
                    && $('#propertyCd').val().trim() != $('#propertyValue').val().trim() != ''
                    &&lettersnumbers.test($("#propertyCd").val())
                    &&lettersnumbers.test($("#propertyValue").val())) {
                	popup('800px','470px','${ctx}/custom/fitproperty/formSub?propertyCd=' + $('#propertyValue').val()+"&delIndex="+delIndex);
                } else {
                    // 请输入合法项目值！
                    layer.msg('<spring:message code="Please_enter_the_legal_project_code"/>', {time:1000});
                }

            }

            //选择添加子项目
            function addPropertyValue(){

                // 调取后台查询子项list
                $.post("${ctx}/custom/fitproperty/searchSubList?propertyCd = " + $('#propertyValue').val(), "", function(result) {

                    var h = $(callBackHtml(result)).find("#subItem").html();
                    $('#subItem').html(h);

                    $("#contain").addClass('tabScroll');

                    var theadW = $('.tabScroll thead').width();
                    var theadTh = $('.tabScroll thead tr th').length;
                    $('.tabScroll thead tr th').width(theadW/theadTh);
                    $('.tabScroll tbody tr:first-child td').each(function(){
                        var indexNum = $(this).index();
                        var tdWidth = $('.tabScroll tbody tr:first-child td').eq(indexNum).css('width')
                        $('.tabScroll thead tr th').eq(indexNum).width(tdWidth);
                    });
                }, 'html');
            }

            // 子项值是否重复
            function isSubPropertyValueRepeate(propertyalue,delIndex) {
                var number = 0;
                // 页面获取值
                $("[name='subItemValues']").each(function(i){
                    if(propertyalue.trim() == $(this).val().trim() && delIndex!=i){
                        number = number+1;
                    }
                });

                if (number> 0) {
                    return true;
                } else {
                    return false;
                }
            }
        </script>
    </head>
    <body>
    <form id="inputForm" method="post">
        <!--头部-->
        <div id="createHead" class="layerHeader clearfix">
            <c:choose>
                <c:when test="${fitproperty.id!=null&&fitproperty.id!=''}">
                    <!--编辑项目-->
                    <p class="headerTitle"><spring:message code="fitproperty_modifyfitproperty"/></p>
                </c:when>
                <c:otherwise>
                    <!--新建项目-->
                    <p class="headerTitle"><spring:message code="fitproperty_createfitproperty"/></p>
                </c:otherwise>
            </c:choose>
            <div class="headerButton clearfix">
                    <div class="clearfix">
                        <shiro:hasPermission name="custom:fitproperty:edit">
                            <!--项目保存-->
                            <button type="button"   style="margin:0 auto;" onclick="saveForm.save(0,this)"><spring:message code="fitproperty_save"/></button>
                            <c:if test="${empty fitproperty.id}">
                                <!--项目保存并继续-->
                                <button type="button"  onclick="saveForm.save(1,this)"><spring:message code="fitproperty_saveAndcontinue"/></button>
                            </c:if>
                        </shiro:hasPermission>
                        <!-- 取消 -->
                        <button type="button" onclick="closeWin()"><spring:message code="company_edit_cancle"/></button>
                    </div>
            </div>
        </div>
        <c:set value="<%=ResourcesUtil.getConfig(\"fitPropertyStyle\")%>" var="styleCategory" />
        <c:set value="<%=ResourcesUtil.getConfig(\"fitPropertyUseType\")%>" var="useType" />
        <input type="hidden" id="id" name="id" value="${fitproperty.id}"/>
        <input type="hidden"  name="version" value="${fitproperty.version}"/>
        <input type="hidden"  id="listLength" value="${fn:length(fitpropertyList) } "/>
        <input type="hidden" id="oldPropertyValue" name="oldPropertyValue" value="${fitproperty.oldPropertyValue}"/>
        <input type="hidden" id="oldPropertyCd" name="oldPropertyCd" value="${fitproperty.propertyCd}"/>
        <div class="tabBoxSm">
                <div class="tabSm smOrderBox">
                    <div class="clearfix">
                        <div class="col-50 items clearfix haveToBox">
                        <!-- 数据代码 -->
                            <p class="tit"><spring:message code="fitproperty_Cd"/></p>
                            <input type="text" id="propertyCd"  name="propertyCd" value="${fitproperty.propertyCd}" maxlength="22" data-rule-required="true" data-rule-lettersnumbers="true"  data-msg-lettersnumbers="<spring:message code="fitproperty_pleaseInputFitproperty_Cd"/>"  data-msg-required="<spring:message code="fitproperty_pleaseInputFitproperty_Cd"/>" >
                            <p class="haveTo">*</p>
                        </div>
                        <div class="col-50 items clearfix haveToBox">
                            <!--项目值-->
                            <p class="tit"><spring:message code="fitproperty_value"/></p>
                            <input type="text"  id="propertyValue" name="propertyValue" value="${fitproperty.propertyValue}"  data-rule-notEqualTo="#propertyCd" data-msg-notEqualTo="<spring:message code="fitpropertyPropertyValueAndCodeNotRepetition"/>" data-rule-lettersnumbers="true"  data-msg-lettersnumbers="<spring:message code="fitproperty_pleaseInputValue"/>" maxlength="22" data-msg-required="<spring:message code="fitproperty_pleaseInputValue"/>" data-rule-required="true" class="" >
                            <p class="haveTo">*</p>
                        </div>
                    </div>
                    <div class="clearfix">
                        <div class="col-50 items clearfix haveToBox">
                        <!--选择款式分类-->
                        <p class="tit"><spring:message code="fitproperty_styleCategory"/></p>
                        <select style="width: 150px" id="styleCategoryCd" name="styleCategoryCd" data-rule-required="true" data-msg-required="<spring:message code="fitproperty_pleaseChoosedStyle"/>" >
                             <option value=""><spring:message code="fitproperty_pleaseChoosed"/></option>
                              <c:forEach items="${fns:getDictList(styleCategory)}"   var="style">
                                 <option  <c:if test="${fn:split(fitproperty.styleCategoryCd,'-')[1] eq style.itemValue}">selected="selected"</c:if> value="${style.itemCode}-${style.itemValue}" > 
                                     ${style.itemName}
                                 </option>
                             </c:forEach>
                         </select>
                         <p class="haveTo">*</p>
                    </div>
                        <div class="col-50 items clearfix haveToBox">
                            <!--项目中文名-->
                            <p class="tit"><spring:message code="fitproperty_Cn"/></p>
                            <input type="text"  id="propertyNameCn" name="propertyNameCn" value="${fitproperty.propertyNameCn}" maxlength="50" data-rule-required="true"  data-msg-required="<spring:message code="fitproperty_pleaseInputCn"/>" class="form-control fam" >
                            <p class="haveTo">*</p>
                        </div>
                    </div>
                    <div class="clearfix">
                    <div class="col-50 items clearfix haveToBox">
                        <!--项目英文名-->
                        <p class="tit"><spring:message code="fitproperty_En"/></p>
                        <input type="text" id="propertyNameEn" name="propertyNameEn" value="${fitproperty.propertyNameEn}"  maxlength="50" data-rule-required="true"  data-msg-required="<spring:message code="fitproperty_pleaseInputEn"/>" class="form-control fam" >
                        <p class="haveTo">*</p>
                    </div>
                    <div class="col-50 items clearfix haveToBox">
                        <!--项目日文名-->
                        <p class="tit"><spring:message code="fitproperty_Jp"/></p>
                        <input type="text"  id="propertyNameJp" name="propertyNameJp" value="${fitproperty.propertyNameJp}" maxlength="50" data-rule-required="true"  data-msg-required="<spring:message code="fitproperty_pleaseInputJp"/>" class="form-control fam" >
                        <p class="haveTo">*</p>
                    </div>
                </div>
                </div>
                <div class="">
                        <div class="tableArea">
                            <div style="float: left;">
                                <div style="float: left;margin-left: 10px">
                                    <p class="tit"><spring:message code="fitproperty_sub"/>
                                    </p>
                                </div>
                            </div>
                            <div style="float: left;margin-left: 10px">
                                <!-- 选择添加 -->
                                <button type="button" onclick="createSubItem(-1)"><spring:message code="fitproperty_chooseAdd"/></button>
                            </div>
                            <!-- 子项显示区 -->
                            <div class="tableScroll tableScrollSm" style="padding-top: 0px;margin-left: 80px" >
                                <div style = "overflow: auto; position: relative;background-color:#ddd;">
                                    <table cellpadding="0" class="" name ="perantTable" id ="perantTable"  style="border: none">
                                        <tr>
                                            <!--子项值-->
                                            <th class="table-gszhkhmc" style="border: none"><spring:message code="fitproperty_value"/></th>
                                            <!--子项加量范围-->
                                            <th class="table-gszhkhmc" style="border: none"><spring:message code="fitproperty_additionalRanges"/></th>
                                            <!--子项缩减范围-->
                                            <th class="table-gszhkhmc" style="border: none"><spring:message code="fitproperty_rangeReduction"/></th>
                                            <!--子项中文全称-->
                                            <th class="table-gszhkhsj" style="border: none"><spring:message code="fitproperty_Cn"/></th>
                                            <!--子项英文全称-->
                                            <th class="table-gszhkhsj" style="border: none"><spring:message code="fitproperty_En"/></th>
                                            <!--子项日文全称-->
                                            <th class="table-gszhkhsj" style="border: none"><spring:message code="fitproperty_Jp"/></th>
                                            <!--子项删除按钮-->
                                            <th class="table-gszhkhsj" style="border: none"><spring:message code="fitproperty_operation"/></th>
                                        </tr>
                                    </table>
                                </div>
                                <div style = "overflow: auto; position: relative;background-color:#fff;border:1px solid #B7B9B8;height:140px;">
                                    <table cellpadding="0" class="" name ="perantTable" id ="subItem" >
                                    <tbody >
                                        <c:forEach items="${fitpropertyList}" var="fitpropertyList" varStatus="status">
                                            <c:if test="${fitpropertyList.deleteFlag != '1'}">
                                            <tr>
                                                <p><input name="subItemValues" type="hidden" value="${fitpropertyList.fitUseTypeCd}"/></p>
                                                <td class="table-gszhkhmc" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;" ><p>${fitpropertyList.propertyValue}<input name="subItemValues" type="hidden" value="${fitpropertyList.propertyValue}"/></p></td>
                                                <td class="table-gszhkhmc" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;" ><p><fmt:formatNumber value="${fitpropertyList.propertyInFrom}" pattern="#,#00.00#"/>~<fmt:formatNumber value="${fitpropertyList.propertyInTo}" pattern="#,#00.00#"/></p></td>
                                                <td class="table-gszhkhmc" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;"  ><p><fmt:formatNumber value="${fitpropertyList.propertyOutFrom}" pattern="#,#00.00#"/>~<fmt:formatNumber value="${fitpropertyList.propertyOutTo}" pattern="#,#00.00#"/></p></td>
                                                <td class="table-gszhkhsj" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;" ><p>${fitpropertyList.propertyNameCn}</p></td>
                                                <td class="table-gszhkhsj" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;" ><p>${fitpropertyList.propertyNameEn}</p></td>
                                                <td class="table-gszhkhsj" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;" ><p>${fitpropertyList.propertyNameJp}</p></td>
                                                <td class="table-gszhkhsj" style="border: none;border-bottom:1px solid #B7B9B8; border-right:1px solid #B7B9B8;" >
                                                <button  type="button"  onclick="createSubItem(${status.index})"><spring:message code="company_edit_edit"/></button>
                                                <button  type="button"  onclick="deleteSub(${status.index})"><spring:message code="company_edit_delete"/></button>
                                                </td>
                                            </tr>
                                            </c:if>
                                        </c:forEach>
                                    </tbody>
                                    </table>
                               </div>
                            </div>
                    </div>
                    </div>
                <div class="clearfix">
                <div class="tabSm smOrderBox">
                    <div class="col-50 items clearfix">
                        <!--项目状态-->
                        <p class="tit"><spring:message code="fitproperty_state"/></p>
                        <div class="labelBox">
                            <label class="lbst">
                                <input type="radio"  checked='checked' name="enableFlag" value="1" <c:if test="${fitproperty.enableFlag eq 1}">checked="checked"</c:if> class="rast"/><spring:message code="fitproperty_enable"/>
                            </label>
                            <label class="lbst">
                                <input type="radio" name="enableFlag" value="0" <c:if test="${fitproperty.enableFlag eq 0}">checked="checked"</c:if> class="rast" /><spring:message code="fitproperty_disable"/>
                            </label>
                        </div>
                    </div>
                    <div class="col-50 items clearfix">
                        <!--项目描述-->
                        <p style="float: left;width: 85px"><spring:message code="fitproperty_remarks"/>
                        <span >(0/100)</span>
                        </p>
                        <div class="">
                            <textarea   name="remarks"  maxlength="100" value="${fitproperty.remarks}">${fitproperty.remarks}</textarea>
                        </div>
                    </div>
                 </div>

            </div>
            </div>
    </form>
    </body>
</html>
